class PageSelect {
    constructor(containerId, options = {}) {
        this.container = document.getElementById(containerId);
        this.currentPage = options.currentPage || 1;
        this.pageSize = options.pageSize || 10;
        this.totalPages = options.totalPages || 0;
        this.onChange = options.onChange || (() => {});
        
        this.init();
    }

    init() {
        const paginationHtml = `
            <div class="pagination">
                <button class="page-btn prev-btn" ${this.currentPage <= 1 ? 'disabled' : ''}>
                    上一页
                </button>
                <span class="page-info">
                    第 ${this.currentPage} 页 / 共 ${this.totalPages} 页
                </span>
                <button class="page-btn next-btn" ${this.currentPage >= this.totalPages ? 'disabled' : ''}>
                    下一页
                </button>
            </div>
        `;
        
        this.container.innerHTML = paginationHtml;

        const prevBtn = this.container.querySelector('.prev-btn');
        const nextBtn = this.container.querySelector('.next-btn');
        
        prevBtn.addEventListener('click', () => this.previousPage());
        nextBtn.addEventListener('click', () => this.nextPage());
    }

    update(op) {
        this.currentPage = op.currentPage || this.currentPage;
        this.totalPages = op.totalPages || this.totalPages;
        this.init();
    }

    previousPage() {
        if (this.currentPage > 1) {
            this.currentPage--;
            this.onChange(this.currentPage, this.pageSize);
            this.init();
        }
    }

    nextPage() {
        if (this.currentPage < this.totalPages) {
            this.currentPage++;
            this.onChange(this.currentPage, this.pageSize);
            this.init();
        }
    }
}
